<script setup lang="ts">
import { ref, defineEmits } from "vue";
import { issueApp } from "@/api/vap/cluster";

const emit = defineEmits(["onSearchEnv"]);
const onSearchTable = () => {
  emit("onSearchEnv");
};

const formArgus = ref({
  appName: "",
  alias: "",
  icon: "",
  linkPath: "",
  execPath: "",
  appParams: "",
  workSpace: "",
  isAdmin: false,
  isSingle: false,
  isPublic: true,
  clusterId: "0"
});

const dialogVisible = ref(false);

const showdialogForAdd = (row: any) => {
  console.log(row);
  const param = getQueryParams(window.location.href);
  console.log(param);
  formArgus.value.clusterId = param.get("id");
  formArgus.value.appName = row.appName;
  formArgus.value.alias = row.appName;
  formArgus.value.icon = row.icon;
  formArgus.value.linkPath = row.linkPath;
  formArgus.value.execPath = row.exePath;
  formArgus.value.appParams = row.appParams;
  formArgus.value.workSpace = row.workSpace;

  dialogVisible.value = true;
};
const getQueryParams = (url: string) => {
  const paramArr = url.slice(url.indexOf("?") + 1).split("&");
  const params = new Map();
  paramArr.map(param => {
    const [key, val] = param.split("=");
    params.set(key, decodeURIComponent(val));
  });
  return params;
};
const clickSubmit = () => {
  issueApp(formArgus.value).then(() => {
    dialogVisible.value = false;
    onSearchTable();
  });
};
defineExpose({
  showdialogForAdd
});
</script>

<template>
  <el-dialog v-model="dialogVisible" title="发布应用">
    <el-form ref="elForm" :model="formArgus" label-width="100px">
      <el-form-item label="名称">
        <el-input v-model="formArgus.appName" show-word-limit clearable />
      </el-form-item>
      <el-form-item label="别名">
        <el-input v-model="formArgus.alias" show-word-limit clearable />
      </el-form-item>
      <el-form-item label="执行路径">
        <el-input v-model="formArgus.execPath" show-word-limit clearable />
      </el-form-item>
      <el-form-item label="启动参数">
        <el-input v-model="formArgus.appParams" show-word-limit clearable />
      </el-form-item>
      <el-form-item label="工作空间">
        <el-input v-model="formArgus.workSpace" show-word-limit clearable />
      </el-form-item>
      <el-form-item label="启动权限">
        <el-radio-group v-model="formArgus.isAdmin">
          <el-radio :label="true">管理员权限</el-radio>
          <el-radio :label="false">一般权限</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="运行模式">
        <el-radio-group v-model="formArgus.isSingle">
          <el-radio :label="true">单例模式</el-radio>
          <el-radio :label="false">共享模式</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="公开范围">
        <el-radio-group v-model="formArgus.isPublic">
          <el-radio :label="true">全局</el-radio>
          <el-radio :label="false" :disabled="true">非全局</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="clickSubmit"> 提交 </el-button>
      </span>
    </template>
  </el-dialog>
</template>

<style scoped></style>
